import CodeBlock from "../../../component/CodeBlock";
import { code } from "./codeData";

function ContextTest() {
    return (<div className="tab-pane">
        <h1>Context API</h1>
        <p>Context API是一种在组件树中传递数据的方法，而不必一层层手动传递props。</p>

        <h3>创建Context</h3>
        <CodeBlock code={code.context1}></CodeBlock>

        <h3>提供Context值</h3>
        <CodeBlock code={code.context2}></CodeBlock>

        <h3>使用useContext Hook</h3>
        <CodeBlock code={code.context3}></CodeBlock>
    </div>);
}

export default ContextTest;